<!--自定义标题-->
<template>
    <div class="v-title">
      <div class="title-ara">
        <H2>
          {{title}}
        </H2>
        <div class="title-button">
          <slot></slot>
        </div>
      </div>
      <div class="bottom-line"></div>
    </div>
</template>

<script>
export default {
  name: "v-title",
  props:{
   title:{
     type:String,
     default:""
   }
  }
}
</script>

<style lang="less" scoped>
.v-title{
  height: 30px;
  h2{
    float: left;
    height: 30px;
  }
  .title-button{
    float: right;
    top: -5px;
    position: relative;
    button{
      margin-right: 5px;
    }
  }
  .bottom-line{
    border-bottom: 2px solid #777f90;
    display: block;
    height: 1px;
    width: 100%;
    min-width: 100%;
    margin: 24px 0;
    clear: both;
    bottom: 0px;
  }
}
</style>
